<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>盒子模型</title>
    <link href="《15》css盒子模型.css" rel="stylesheet" type="text/css">
</head>
<body>
      <div class="box">
         你的孤独虽败犹荣
      </div>

      <h1>python</h1>

      <table border="1px" class="td">
          <tr>
              <td>
                  <h1>中文</h1>
              </td>
          </tr>
      </table>

      <div class="wb">
          <div class="bk">
              <div class="nj">
                  <div class="zw">
                      div嵌套
                  </div>
              </div>
          </div>
      </div>

    <div class="wb">
              <div class="bk">
                  <div class="nj">
                      <div class="zw">
                          div嵌套
                      </div>
                  </div>
              </div>
          </div>

</body>
</html>


<!--
引题：网页中有非常多的div标签
查看盒子区域：谷歌浏览器网页右键检查，css源代码滑动到最下有盒子图例。

div标签：divide 分割。把网页分割成一个一个小块。把网页看做中一个个盒子（模块）的组合。更有利于控制排版和维护代码。div标签没有实际意义，只是一个容器。

div常用属性：
width宽 height高 border边界，如果没有定义宽 高，那么div的宽高默认是由内容的宽高决定的。
padding 内边距，div内容距离边界的距离。
margin 外边距，多个div之间的距离。
-->

<!--
课外: 浮动 span标签 绝对定位 相对定位

-->